<template>
 
    <view class="serveContainer">
      <view class="content">
        <image
          src="../../static/image/微信图片_20210809134156.png"
          @click="toBook"
        ></image>
        <button type="default" @click="toDetail">报一笔</button>
      </view>
      <view class="text-area">
        <text>下载司小宝APP,可体验完整功能></text>
      </view>
	   <u-tabbar :list="tabbar"></u-tabbar>
    </view>
</template>

<script>
import { mapGetters } from "vuex";
export default {
  name: "serve",
  data() {
    return {};
  },
  computed: {
    ...mapGetters(["tabbar"]),
  },
  methods: {
    // 跳转到报账本页
    toBook() {
      wx.navigateTo({
        url: "/pages/serve/book/book",
      });
    },
    // 跳转账单详情页
    toDetail() {
      wx.navigateTo({
        url: "/pages/serve/detail/detail",
      });
    },
  },
};
</script>

<style lang="less">
.serveContainer {
  height: 100%;
  width: 100%;
  background-color: #f2f1f6;
  .content {
    image {
      margin: 25upx;
      width: 700upx;
      height: 256upx;
    }
    button {
      // height: 100upx;
      margin: 90upx 25upx 0 25upx;
      border-radius: 10upx;
      font-size: 34upx;
      background-color: #7b58f4;
      color: white;
    }
  }
  .text-area {
    background-color: red;
    margin: 100upx 0;
    position: relative;
    text {
      font-size: 28upx;
      font-weight: 300;
      position: absolute;
      left: 50%;
      margin-left: -25%;
    }
  }
}
</style>
